<template>
  <div>
    <p0>我的收藏/收藏职位</p0>
    <div1>
  <el-table
    :data="jobList"
    header-cell-style="{background:'#eef1f6',color:'#606266'}"
    :row-style="{height:'50px',fontSize:'18px',color:'#666',fontFamily:'MicrosoftYaHeiUI'}"
    style="width: 100%">
    <el-table-column
      label="序号"
      prop="ordno"
      type="index"
      width="100"
      align="left">
    </el-table-column>
    <template v-for="item in tableLabel">
            <el-table-column
              :key="index"
              :prop="item.prop"
              :label="item.label"
              :width="item.width"
              :align="item.align">
            </el-table-column>
    </template>
    <!--el-table-column
      label="职位名称"
      prop="jobname"
      width="350">
      <template slot-scope="scope">
        <span style="margin-left: 10px">{{ scope.row.jobname }}</span>
      </template>
    </el-table-column>
    <el-table-column
      label="公司名称"
      prop="companyname"
      width="300">
      <template slot-scope="scope">
        <span style="margin-left: 10px">{{ scope.row.companyname }}</span>
      </template>
    </el-table-column>-->
    <el-table-column
      label="职位ID"
      prop="jid"
      v-if="show"
      align="left">
    </el-table-column>
    <el-table-column label="操作" width="200" align="center">
      <template slot-scope="scope">
        <el-button
          size="mini"
          @click="handleEdit(scope.$index, scope.row)">投递简历</el-button>
        <el-button
          size="mini"
          type="danger"
          @click="handleDelete(scope.$index, scope.row)">取消收藏</el-button>
      </template>
    </el-table-column>
  </el-table>
      </div1>
    <el-pagination
        background
        :page-sizes="pageSizes"
        :page-size="page.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="sizeChange"
        @current-change="currentChange"
        :total="page.total"
        class="page">
  </el-pagination>

  <el-dialog title="投递简历" :visible.sync="dialogFormVisible1" width="550px">
  <el-form :model="form">
    <el-form-item label="投递职位信息" label-width="180px" align="left">
      <span>{{ form.jobName }}</span>
      <!--<el-input v-model="form.contact" autocomplete="off" style="width:300px"></el-input>-->
    </el-form-item>
    <el-form-item label="选择投递简历" label-width="180px" align="left">
        <el-cascader
            :options="CVoptions"
            placeholder="请选择简历"
            @active-item-change="handleItemChange"
            :props="props">
        </el-cascader>
    </el-form-item>
    <el-form-item label="最快到岗时间" label-width="180px" align="left">
      <el-select v-model="form.arrtime" placeholder="请选择最快到岗时间">
        <el-option label="一周内" value="0"></el-option>
        <el-option label="一个月内" value="1"></el-option>
        <el-option label="三个月内" value="2"></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="工作时长" label-width="180px" align="left">
      <el-select v-model="form.months" placeholder="请选择">
        <el-option label="一个月内" value="0"></el-option>
        <el-option label="一至三个月内" value="1"></el-option>
        <el-option label="三至六个月内" value="2"></el-option>
        <el-option label="六个月以上" value="3"></el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="每周工作天数" label-width="180px" align="left">
      <el-select v-model="form.days" placeholder="请选择">
        <el-option label="两天" value="0"></el-option>
        <el-option label="三天" value="1"></el-option>
        <el-option label="四天" value="2"></el-option>
        <el-option label="五天" value="3"></el-option>
        <el-option label="六天" value="4"></el-option>
        <el-option label="七天" value="5"></el-option>
      </el-select>
    </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible1 = false">取 消</el-button>
    <el-button type="primary" @click="dialogFormVisible1 = false">立即投递</el-button>
  </div>
  </el-dialog>

  </div>
</template>

<script>
import fetch from '../api/fetch'

export default {
  name:'app',
  mounted() {
    this.getStuCollect({
        pageNum:1,
        pageSize:20,
        StuCollect:{
          sid:sessionStorage.getItem('userId')
        }
      })
  },
  data() {
    return {
      show:false,
      sid:'',
      jobList:[],
      tableLabel:[
        {prop:"jobname", label:"职位名称",width:"300",align:"center"},
        {prop:"Entname", label:"公司名称",width:"300",align:"center"},
      ],
      page:{
        pageSize:10,
        currentPage:1,
        pageSizes:[5,10,20,30,50],
        total:0
      },
      CVoptions: [{
          label: '在线简历',
          CVlist: []
        }, {
          label: '本地简历',
          CVlist: []
        }],
        props: {
          value: 'label',
          children: 'CVlist'
        },
      dialogFormVisible1: false,
      form: {
        jobName:'后端实习生',
        CV: '',
        arrtime: '',
        months: '',
        days: ''
      },
      }
    },
    methods: {
    getStuCollect(StuCollect){
        fetch.getStuCollect(StuCollect).then(res => {
          console.log(res)
           for (var i=0; i<res.data.rows.length; i++)
           {
            this.jobList.push({
              jobname: res.data.rows[i].jobname,
              Entname: res.data.rows[i].ename,
            })
          }
          this.page.currentPage=res.data.page
          this.page.total=res.data.total
        })
      },
     handleItemChange(val) {
        console.log('active item:', val);
        setTimeout(_ => {
          if (val.indexOf('在线简历') > -1 && !this.CVoptions[0].CVlist.length) {
            this.CVoptions[0].CVlist = this.onlineCV;
          } else if (val.indexOf('本地简历') > -1 && !this.CVoptions[1].CVlist.length) {
            this.CVoptions[1].CVlist = this.localCV;
          }
        }, 300);
      },
      //每页数据条数改变事件
      sizeChange(pageSize){
        this.page.pageSize=pageSize
        this.loadData()
      },
      //当前页数据改变事件
      currentChange(currentPage){
        this.page.currentPage = currentPage
        this.loadData()
      },
      //数据加载事件
      loadData(){
        getjobList(this.sid).then(res=>{
          this.jobList=res.data.data
          //this.page.total=res.data.total
        })
      },
      handleDelete (index, row) {
      console.log(index, row);
      this.$confirm('取消收藏, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$message({
          type: 'success',
          message: '取消收藏成功!'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },
      handleEdit(index, row) {
        console.log(index, row);
        this.dialogFormVisible1 = true;

      },
      getDetails (row) {
        console.log(row)//此时就能拿到整行的信息
      },
       setNewsApi: function() {
        this.$http.get("/companyDelete", "").then(res => {
          this.data = res.data.data;
        });
      },
      deleteList(data) { //删除数据
        let jid = data.jid;
        this.$http.post('/list', {
            params: {
              id: jid
            }
          }).then(function(res) {
            console.log(res);
            this.data = res.data.data;
            alert(data.name + '取消收藏成功');
          }.bind(this))
          .catch(function(error) {
            console.log(error)
          });
      }
    }
  }
</script>

<style scoped>
p0 {
  position: absolute;
  left: 250px;
  top: 75px;
  font-size: 14px;
  color: #909399
}
div1 {
  position: absolute;
  left: 275px;
  top: 120px;
  }
.page {
  position: absolute;
  left: 600px;
  bottom: 100px;
}
</style>
